<template>
  <div class="main">
    <a-tabs v-model:activekey="active" @change="tabsEvent">
      <a-tab-pane key="1">
        <span slot="tab">上传营业执照
          <a-icon v-if="channelData.businessLicenseVo != null" type="check-circle" theme="twoTone" two-tone-color="#52c41a" />
          <a-icon v-else type="question-circle" theme="twoTone" two-tone-color="#bbb" />
        </span>
        <business-license-upload :channelData='channelData' @processTypeFun='processTypeFun'></business-license-upload>
      </a-tab-pane>
      <a-tab-pane key="2" force-render>
        <span slot="tab">上传法人身份证
          <a-icon v-if="channelData.channelLegalVo != null" type="check-circle" theme="twoTone" two-tone-color="#52c41a" />
          <a-icon v-else type="question-circle" theme="twoTone" two-tone-color="#bbb" />
        </span>
        <id-card-upload :channelData='channelData' @processTypeFun='processTypeFun'></id-card-upload>
      </a-tab-pane>
      <a-tab-pane key="3">
        <span slot="tab">法人实名手机认证
          <a-icon v-if="channelData.channelLegalVo != null && channelData.channelLegalVo.phone != null" type="check-circle" theme="twoTone" two-tone-color="#52c41a" />
          <a-icon v-else type="question-circle" theme="twoTone" two-tone-color="#bbb" />
        </span>
        <phone-authentication :channelData='channelData' @processTypeFun='processTypeFun'></phone-authentication>
      </a-tab-pane>
      <a-tab-pane key="4">
        <span slot="tab">企业公户校验
          <!--verifyStatus 是否验证成功 -1取消验证;0-等待认证; 1-是; 2-否;-->
          <a-icon v-if="channelData.businessAccountStatus != null && channelData.businessAccountStatus == 1" type="check-circle" theme="twoTone" two-tone-color="#52c41a" />
          <a-icon v-else type="question-circle" theme="twoTone" two-tone-color="#bbb" />
        </span>
        <bank-account-authentication :channelData='channelData' @processTypeFun='processTypeFun'></bank-account-authentication>
      </a-tab-pane>
    </a-tabs>

    <!--强校验公户信息是否认证-->
    <publicAccountInformation :visible='visible' :channelData='channelData' @resetAuthentication='resetAuthentication'></publicAccountInformation>
    <publicAccountAuthentication :visibleAuthentication='visibleAuthentication' :channelData='channelData' @visibleAuthenticationFun='visibleAuthenticationFun'></publicAccountAuthentication>

  </div>
</template>

<script>
import { getWaitCheckAgreeInfo,getLoginChannel4Reg } from '@api/register'
import businessLicenseUpload from './modules/businessLicenseUpload'
import idCardUpload from './modules/idCardUpload'
import phoneAuthentication from './modules/phoneAuthentication'
import bankAccountAuthentication from './modules/bankAccountAuthentication'
import publicAccountInformation from "../dashboard/publicAccountInformation";
import publicAccountAuthentication from "../dashboard/publicAccountAuthentication";
export default {
  name: "RegisterProcess",
  components: {
    businessLicenseUpload,
    idCardUpload,
    phoneAuthentication,
    bankAccountAuthentication,
    publicAccountInformation,
    publicAccountAuthentication
  },
  data () {
    return {
      description: '将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。',
      id:0,
      // form
      form: null,
      resultData:{},
      channelData:{},
      active:'1',


      visible:false,
      visibleAuthentication:false,
    }
  },
  created() {
    this.getLoginChannel4RegFun();
  },
  mounted() {
    const {type} = this.$route.query
    if(type) {
      this.active = type
    }
    /*if(this.channelData.businessLicenseVo != null){
      this.active = '4';
    }else if(this.channelData.channelLegalVo != null){
      this.active = '2';
    }else if(this.channelData.channelLegalVo != null && this.channelData.channelLegalVo.phone != null){
      this.active = '3';
    }else if(this.channelData.businessAccountVo != null){
      this.active = '4';
    }else{
      this.active = '1';
    }
    console.log(11111111112,this.channelData.businessLicenseVo != null,this.active)*/
  },
  methods: {
    tabsEvent(res){
      this.getLoginChannel4RegFun();
      this.active = res;
    },
    processTypeFun(res){
      this.getLoginChannel4RegFun();
      this.active = (parseInt(res)).toString();
    },
    getLoginChannel4RegFun(){
      getLoginChannel4Reg().then(res => {
        if(res.success){
          this.channelData = res.result;

          //判断是否展开校验
          if(this.channelData.channelInfoVo.confirmed ==1){
            this.visible = true;
          }
        }
      })
    },
    //信息有误重新提交认证
    resetAuthentication(type){
      if(type == 1){
        this.visible = false;
      }else if(type == 2){
        this.visible = false;
        this.visibleAuthentication = true;
      }
    },
    visibleAuthenticationFun(){
      this.visibleAuthentication = false;
    },
  }
}
</script>

<style lang="less" scoped>

.main{
  margin: 16px auto;
  background: #fff;
  .content{
    box-sizing: border-box;
    padding: 20px;
  }
  .content-main{
    box-sizing: border-box;
    padding: 20px;
  }
  .steps {
    margin: 16px auto;
  }
  /deep/ .ant-steps-item-active .ant-steps-item-title{
    color: #1890FF;
  }
  /deep/ .ant-steps-item-finish .ant-steps-item-title{
    color: #1890FF;
  }
  /deep/ .ant-steps-item-title{
    font-size: 14px;
    margin-bottom: 6px;
  }
  /deep/ .ant-steps-item-description{
    font-size: 12px;
  }
}

</style>
